import React, { useRef, useState } from "react";
import { PlusOutlined } from "@ant-design/icons";
import { Modal, Button, message } from "antd";
import AutoTable from "@/components/AutoTable/mtable";
import InitForm from "@/components/InitForm";
import { set } from "lodash";
import { doFetch } from "@/utils/doFetch";
import { useRequest } from "ahooks";

const Reback = ({ route }) => {
  const actionRef = useRef()
  const columns = [
    {
      "title": "项目名称",
      "dataIndex": "projectName",
      "key": "projectName",
      "search": false
    },
    {
      "title": "楼栋",
      "dataIndex": "building",
      "key": "building",
      "search": false
    },
    {
      "title": "单元",
      "dataIndex": "unit",
      "key": "unit",
      "search": false
    },
    {
      "title": "使用层数",
      "dataIndex": "useFloor",
      "key": "useFloor",
      "search": false
    },
    {
      "title": "模板名称",
      "dataIndex": "boardTypeName",
      "key": "boardTypeName",
      "search": false
    },
    {
      "title": "返回工厂",
      "dataIndex": "returnFactory",
      "key": "returnFactory",
      "search": false
    },
    {
      "title": "返厂日期",
      "dataIndex": "returnTime",
      "key": "returnTime",
      "search": false
    },
    {
      "title": "返厂车牌号",
      "dataIndex": "returnNo",
      "key": "returnNo",
      "search": false
    },
    {
      "title": "车牌区别号",
      "dataIndex": "distinctNo",
      "key": "distinctNo",
      "search": false
    },
    {
      "title": "数量",
      "dataIndex": "account",
      "key": "account",
      "search": false
    },
    {
      "title": "面积",
      "dataIndex": "area",
      "key": "area",
      "search": false
    },
    {
      "title": "重量",
      "dataIndex": "weight",
      "key": "weight",
      "search": false
    },
    {
      "title": "清点日期",
      "dataIndex": "checkTime",
      "key": "checkTime",
      "search": false
    },
    {
      "title": "清点第一负责人",
      "dataIndex": "checkFirstPerson",
      "key": "checkFirstPerson",
      "search": false
    },
    {
      "title": "清点第二负责人",
      "dataIndex": "checkSecondPerson",
      "key": "checkSecondPerson",
      "search": false
    },
    {
      "title": "审核人",
      "dataIndex": "auditPerson",
      "key": "auditPerson",
      "search": false
    },
    {
      "title": "状态名称",
      "dataIndex": "statusName",
      "key": "statusName",
      "search": false
    }, {
      "title": "操作",
      "valueType": "option",
      render: (_, row) => {
        return [<a type="text" disabled={row.status == 2} onClick={() => {
          if(row.status == 2) return;
          run({ url: "/returnBoard/finish", params: { id: row.id } })
        }}>关闭</a>, <a type="link" onClick={async () => {
          let res = await doFetch({ url: "/returnBoard/queryDetail", params: { id: row.id } });
          console.log(res?.data?.data?.detailList);
          let result = res?.data?.data?.detailList ?? [];
          Modal.info({
            title: "查看详情",
            width: 1200,
            content: <div>
              <AutoTable
                columns={[
                  {
                    "title": "长度",
                    "dataIndex": "length",
                    "key": "length",
                    "search": false
                  },
                  {
                    "title": "宽度",
                    "dataIndex": "width",
                    "key": "width",
                    "search": false
                  },
                  {
                    "title": "是否起孔",
                    "dataIndex": "isHaveHoleName",
                    "key": "isHaveHoleName",
                    "search": false
                  },
                  {
                    "title": "起始孔位",
                    "dataIndex": "upHole",
                    "key": "upHole",
                    "search": false
                  },
                ]}
                dataSource={result}
                pagination="false"
                headerTitle={"详情"}
              ></AutoTable>
            </div>
          })
        }}>详情</a>]
      }
    }
  ], fields = {
    "projectName": {
      "value": null,
      "type": "input",
      "title": "项目名称",
      "name": [
        "projectName"
      ],
      "required": true
    },
    "building": {
      "value": null,
      "type": "input",
      "title": "楼栋",
      "name": [
        "building"
      ],
      "required": true
    },
    "unit": {
      "value": null,
      "type": "input",
      "title": "单元",
      "name": [
        "unit"
      ],
      "required": true
    },
    "useFloor": {
      "value": null,
      "type": "input",
      "title": "使用层数",
      "name": [
        "useFloor"
      ],
      "required": true
    },
    "boardTypeName": {
      "value": null,
      "type": "input",
      "title": "模板类别",
      "name": [
        "boardTypeName"
      ],
      "required": true
    },
    "returnFactory": {
      "value": null,
      "type": "input",
      "title": "返回工厂",
      "name": [
        "returnFactory"
      ],
      "required": true
    },
    "returnTime": {
      "value": null,
      "type": "datepicker",
      "title": "返厂日期",
      "name": [
        "returnTime"
      ],
      "required": true,
      "format": "YYYY-MM-DD",
      "showTime": false,
      "disabledDate": null,
      "disabledDateTime": null
    },
    "returnNo": {
      "value": null,
      "type": "input",
      "title": "返厂车牌号",
      "name": [
        "returnNo"
      ],
      "required": true
    },
    "distinctNo": {
      "value": null,
      "type": "input",
      "title": "车牌区别号",
      "name": [
        "distinctNo"
      ],
      "required": true
    },
    "account": {
      "value": null,
      "type": "inputnumber",
      "title": "数量",
      "name": [
        "account"
      ],
      "required": true
    },
    "area": {
      "value": null,
      "type": "inputnumber",
      "title": "面积",
      "name": [
        "area"
      ],
      "required": true
    },
    "weight": {
      "value": null,
      "type": "inputnumber",
      "title": "重量",
      "name": [
        "weight"
      ],
      "required": true
    },
    "checkTime": {
      "value": null,
      "type": "datepicker",
      "title": "清点日期",
      "name": [
        "checkTime"
      ],
      "required": true,
      "format": "YYYY-MM-DD",
      "showTime": false,
      "disabledDate": null,
      "disabledDateTime": null
    },
    "checkFirstPerson": {
      "value": null,
      "type": "input",
      "title": "清点第一负责人",
      "name": [
        "checkFirstPerson"
      ],
      "required": true
    },
    "checkSecondPerson": {
      "value": null,
      "type": "input",
      "title": "清点第二负责人",
      "name": [
        "checkSecondPerson"
      ],
      "required": true
    },
    "auditPerson": {
      "value": null,
      "type": "input",
      "title": "审核人",
      "name": [
        "auditPerson"
      ],
      "required": true
    }
  }
  const [vs, setvs] = useState(false);
  let { run, loading } = useRequest(doFetch, {
    debounceWait: 300, //防抖
    manual: true,
    formatResult: (res) => res,
    onSuccess: (result, params) => {
      console.log(result);
      if (result.code == "0000") {
        message.success('操作成功！');
        setvs(false);
        actionRef?.current?.reload()
      }
    },
  });

  return (
    <>
      <InitForm
        vs={vs}
        submitting={loading}
        setvs={(key) => {
          setvs(key)
        }}
        title={"新增"}
        fields={fields}
        onChange={() => { }}
        reset={true}
        submitData={(values) => {
          run({ url: "/returnBoard/save", params: { ...values } })
        }}
      ></InitForm>


      <AutoTable
        columns={columns}
        path={"/returnBoard/queryList"}
        pagination="false"
        headerTitle={route.name}
        actionRef={actionRef}
        toolBarRender={() => [
          <Button key="3" type="primary" onClick={() => {
            setvs(true)
          }}>
            新增
          </Button>,
        ]}
      ></AutoTable>

    </>

  );
};


export default Reback;
